<template>
	<div class="aid">
		<div class="base">
			<p class="fixed-top">
				{{ JSON.stringify(text) == '{}' ? '添加分值' : '修改分值' }}
				<a-icon @click="closeFunction" type="close" />
			</p>
			<div class="main" id="new_message">
				<a-form-model ref="ruleForm" :model="form" :rules="rules">
					<a-form-model-item label="活动分类">{{ $route.query.Name }}</a-form-model-item>
					<a-form-model-item label="级别" prop="ActivityLevelID">
						<a-select v-model="form.ActivityLevelID" style="width:100%">
							<a-select-option v-for="(item, index) in LevelList" :key="item.ID" :value="item.ID">
								{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-model-item>
					<a-form-model-item label="是否允许申请" prop="IsAgreeApply">
						<a-radio-group name="radioGroup" v-model="form.IsAgreeApply">
							<a-radio :value="true">是</a-radio>
							<a-radio :value="false">否</a-radio>
						</a-radio-group>
					</a-form-model-item>
					<a-form-model-item label="是否允许发起" prop="IsAgreeCreate">
						<a-radio-group name="radioGroup" v-model="form.IsAgreeCreate">
							<a-radio :value="true">是</a-radio>
							<a-radio :value="false">否</a-radio>
						</a-radio-group>
					</a-form-model-item>
					<a-form-model-item label="是否允许发放" prop="IsAgreeSend">
						<a-radio-group name="radioGroup" v-model="form.IsAgreeSend">
							<a-radio :value="true">是</a-radio>
							<a-radio :value="false">否</a-radio>
						</a-radio-group>
					</a-form-model-item>
					<a-form-model-item label="是否自定义分数" prop="ApplyCustomScore">
						<a-radio-group name="radioGroup" v-model="form.ApplyCustomScore">
							<a-radio :value="true">是</a-radio>
							<a-radio :value="false">否</a-radio>
						</a-radio-group>
					</a-form-model-item>
					<a-form-model-item label="参与者分值" prop="JoinScore">
						<a-input type="number" @blur="changeVal('JoinScore')" :min="0" v-model="form.JoinScore" />
					</a-form-model-item>
					<a-form-model-item label="观众分值" prop="AudienceScore">
						<a-input type="number" @blur="changeVal('AudienceScore')" :min="0" v-model="form.AudienceScore" />
					</a-form-model-item>
					<a-form-model-item label="工作人员分值" prop="WorkerScore">
						<a-input type="number" @blur="changeVal('WorkerScore')" :min="0" v-model="form.WorkerScore" />
					</a-form-model-item>
					<a-form-model-item label="" class="fixed-bottom">
						<a-button type="primary" @click="handleSubmit">
							{{ JSON.stringify(text) == '{}' ? '确认添加' : '确认修改' }}</a-button>
						<a-button style="margin-left: 10px;" @click="closeFunction">取消</a-button>
					</a-form-model-item>
				</a-form-model>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		ManageActivityTypeScoreDoAdd,
		ManageActivityTypeScoreDoUpdate,
		GetClubPageListCommon
	} from '@/api/follow';
	export default {
		props: {
			text: Object,
			DepartCodeList: Array,
			LevelList: Array,
			ClubTypeList: Array,
		},
		watch: {
			text: function(text) {
				if (JSON.stringify(text) == '{}') {} else {
					this.form = text;
				}
			},
			form: {
				handler(newName, oldName) {
					if (newName.Type == 2) {
						this.rules.Value[0].required = false
					} else {
						this.rules.Value[0].required = true
					}
				},
				deep: true
			}
		},
		data() {
			return {
				TypeList: this.global.ActivityTypeList,
				formLayout: 'horizontal',
				form: this.$form.createForm(this, {
					name: 'coordinated'
				}),
				DepartmenDropdowntList: [],
				form: {
					ActivityTypeID: "",
					ActivityLevelID: "",
					IsAgreeApply: "",
					IsAgreeCreate: "",
					IsAgreeSend: "",
					ApplyCustomScore: "",
					JoinScore: "",
					AudienceScore: "",
					WorkerScore: "",
				},
				rules: {
					Type: [{
						required: true,
						message: '请选择类型',
						trigger: 'change'
					}],
					Value: [{
						required: true,
						message: '请选择部门',
						trigger: 'change'
					}],
					ActivityLevelID: [{
						required: true,
						message: '请选择等级',
						trigger: 'change'
					}],
					IsAgreeApply: [{
						required: true,
						message: '请选择是否申请',
						trigger: 'change'
					}],
					IsAgreeCreate: [{
						required: true,
						message: '请选择是否发起',
						trigger: 'change'
					}],
					IsAgreeSend: [{
						required: true,
						message: '请选择是否发放',
						trigger: 'change'
					}],
					ApplyCustomScore: [{
						required: true,
						message: '请选择是否自定义分数',
						trigger: 'change'
					}],

					JoinScore: [{
						required: true,
						message: '请输入参与者分值',
						trigger: 'change'
					}],
					AudienceScore: [{
						required: true,
						message: '请输入观众分值',
						trigger: 'change'
					}],
					WorkerScore: [{
						required: true,
						message: '请输入工作人员分值',
						trigger: 'change'
					}]
					// IsHour: [
					// 	{
					// 		required: true,
					// 		message: '请选择是否按小时计算',
					// 		trigger: 'change'
					// 	}
					// ],
				}
			};
		},
		created() {
			this.fetchClub()
		},
		methods: {
			changeVal(type){
				if(this.form[type]<0){
					this.form[type]=0
				}
			},
			async fetchClub(value) {
				let data = {};
				data.key = value;
				let res = await GetClubPageListCommon(data);
				this.ClubList = res.data.data;
			},
			closeFunction(data) {
				this.form = {};
				this.$emit('closeFun', data);
			},
			handleSubmit(e) {
				this.$refs.ruleForm.validate(async valid => {
					if (valid) {
						let that = this;
						let data = this.form;
						let res = {};
						data.ActivityTypeID = this.$route.query.activityTypeID;

						res = JSON.stringify(this.text) == '{}' ? await ManageActivityTypeScoreDoAdd(data) :
							await ManageActivityTypeScoreDoUpdate(data);
						that.$message[res.data.code == 0 ? 'success' : 'error'](res.data.msg);

						this.closeFunction('1');

					} else {
						return false;
					}
				});
			}
		}
	};
</script>

<style lang="less" scoped>
	/deep/.ant-form-item {
		margin: 20px 50px;
		display: flex;
	}

	/deep/.ant-form-item-label {
		width: 100px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		text-align: right;
	}

	/deep/.ant-form-item-control-wrapper {
		flex: 1;
	}

	.ant-form-item {
		margin-bottom: 10px;
	}

	/deep/.ant-form {
		margin-top: 50px;
		padding-bottom: 50px;
	}
</style>
